﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="renderer" content="webkit">
    <title>富力物业全国集成管控平台</title>
    <meta name="keywords" content="H+后台主题,后台bootstrap框架,会员中心主题,后台HTML,响应式后台">
    <meta name="description" content="H+是一个完全响应式，基于Bootstrap3最新版本开发的扁平化主题，她采用了主流的左右两栏式布局，使用了Html5+CSS3等现代技术">
    <link href="css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="css/font-awesome.min.css?v=4.4.0" rel="stylesheet">
    <link href="css/plugins/treeview/bootstrap-treeview.css" rel="stylesheet">
    <!-- Morris -->
    <link href="css/plugins/morris/morris-0.4.3.min.css" rel="stylesheet">
    <!-- Gritter -->
    <link href="js/plugins/gritter/jquery.gritter.css" rel="stylesheet">
    <link href="css/animate.css" rel="stylesheet">
    <link href="css/style.css?v=4.1.0" rel="stylesheet">
</head>
<body class="gray-bg">
    <div class="wrapper wrapper-content">

        <!--<div class="ibox-title">
            <div style="text-align:center;">
                <h5>全国项目商业资源集成管控平台</h5>
            </div>
        </div>-->
        <div class="row">
            <div class="row">
                <div class="col-sm-2">
                    <div class="widget style1 navy-bg">
                        <div class="row">
                            <div class="col-xs-4">
                                <i class="fa fa-home fa-3x"></i>
                            </div>
                            <div class="col-xs-8 text-right">
                                <span> 在管项目 </span>
                                <h3 class="font-bold">168个</h3>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-sm-2">
                    <div class="widget style1 lazur-bg">
                        <div class="row">
                            <div class="col-xs-4">
                                <i class="fa fa-area-chart fa-3x"></i>
                            </div>
                            <div class="col-xs-8 text-right">
                                <span> 在管面积 </span>
                                <h3 class="font-bold">260㎡</h3>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-sm-2">
                    <div class="widget style1 red-bg">
                        <div class="row">
                            <div class="col-xs-4">
                                <i class="fa fa-pie-chart fa-3x"></i>
                            </div>
                            <div class="col-xs-8 text-right">
                                <span> 2018年累计收楼面积 </span>
                                <h3 class="font-bold">260㎡</h3>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-sm-2">
                    <div class="widget style1 blue-bg">
                        <div class="row">
                            <div class="col-xs-4">
                                <i class="fa fa-user-plus fa-3x"></i>
                            </div>
                            <div class="col-xs-8 text-right">
                                <span> 2018年累计收楼户数 </span>
                                <h3 class="font-bold">2,600户</h3>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-sm-2">
                    <div class="widget style1 black-bg">
                        <div class="row">
                            <div class="col-xs-4">
                                <i class="fa fa-pie-chart fa-3x"></i>
                            </div>
                            <div class="col-xs-8 text-right">
                                <span> 在管会所 </span>
                                <h3 class="font-bold">52个</h3>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-sm-2">
                    <div class="widget style1 yellow-bg">
                        <div class="row">
                            <div class="col-xs-4">
                                <i class="fa fa-user-plus fa-3x"></i>
                            </div>
                            <div class="col-xs-8 text-right">
                                <span> 在管会所面积 </span>
                                <h3 class="font-bold">3,3657㎡</h3>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <!--<div class="col-sm-6" style="padding-top:10px;">
                <iframe src="echarts/doc/example/map111.html" style="padding-top:10px; padding:0px;width:100%;border:none;" onload="this.style.height = this.contentWindow.document.body.scrollHeight + 'px'"></iframe>
            </div>-->

        </div>

        <div class="row">
            <div class="col-sm-12">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h5>拎包入住当月销售情况</h5>
                        <div class="pull-right" style="margin: -7px 7px 0 0">
                            <a href="account_lbrz_tj.html" class="btn btn-danger btn-sm" style="margin-left: 10px;"><i class="fa fa-inr"></i>&nbsp;查看明细 </a>

                        </div>
                    </div>
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-sm-9">
                                <iframe src="echarts/doc/example/mix-line-bar.html" style="padding:0px;width:100%;border:none;" onload="this.style.height = this.contentWindow.document.body.scrollHeight + 'px'"></iframe>
                            </div>
                            <div class="col-sm-3">
                                <ul class="stat-list">
                                    <li>
                                        <h2 class="no-margins">2,346</h2>
                                        <small>年订单总数(单),成交率：</small>
                                        <div class="stat-percent">
                                            48%
                                        </div>
                                        <div class="progress progress-mini">
                                            <div style="width: 48%;" class="progress-bar"></div>
                                        </div>
                                    </li>
                                    <li>
                                        <h2 class="no-margins ">1,000</h2>
                                        <small>年销售金额(万元),现已完成销售目标:</small>
                                        <div class="stat-percent">
                                            60%
                                        </div>
                                        <div class="progress progress-mini" title="销售目标在供应商维护时指定">
                                            <div style="width: 60%;" class="progress-bar"></div>
                                        </div>
                                    </li>
                                    <li>
                                        <h2 class="no-margins ">900</h2>
                                        <small>精装销售额(万元),占销售目标:</small>
                                        <div class="stat-percent">
                                            90%
                                        </div>
                                        <div class="progress progress-mini" title="销售目标在供应商维护时指定">
                                            <div style="width: 80%;" class="progress-bar"></div>
                                        </div>
                                    </li>
                                    <li>
                                        <h2 class="no-margins ">100</h2>
                                        <small>毛坯销售额(万元),占销售目标:</small>
                                        <div class="stat-percent">
                                            10%
                                        </div>
                                        <div class="progress progress-mini" title="销售目标在供应商维护时指定">
                                            <div style="width: 20%;" class="progress-bar"></div>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>

                </div>
            </div>
        </div>

        <div class="row">
            <div class="col-sm-12">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h5>电梯广告业务开展情况</h5>
                        <div class="pull-right" style="margin: -7px 7px 0 0">
                            <a href="account_lbrz_tj1.html" class="btn btn-danger btn-sm" style="margin-left: 10px;"><i class="fa fa-inr"></i>&nbsp;查看明细 </a>

                        </div>
                    </div>
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-sm-9">
                                <iframe src="echarts/doc/example/mix-line-bar2.html" style="padding:0px;width:100%;border:none;" onload="this.style.height = this.contentWindow.document.body.scrollHeight + 'px'"></iframe>
                            </div>
                            <div class="col-sm-3">
                                <ul class="stat-list">
                                    <li>
                                        <h2 class="no-margins ">2,7419</h2>
                                        <small>商业资源总数</small>
                                    </li>
                                    <li>
                                        <h2 class="no-margins">6,238</h2>
                                        <small>电梯总数,开展业务占比：</small>
                                        <div class="stat-percent">
                                            51%
                                        </div>
                                        <div class="progress progress-mini">
                                            <div style="width: 51%;" class="progress-bar"></div>
                                        </div>
                                    </li>
                                    <li>
                                        <h2 class="no-margins ">20,790</h2>
                                        <small>广告类资源总数,占总资源的:</small>
                                        <div class="stat-percent">
                                            75%
                                        </div>
                                        <div class="progress progress-mini" title="">
                                            <div style="width: 76%;" class="progress-bar"></div>
                                        </div>
                                    </li>
                                    <li>
                                        <h2 class="no-margins ">391</h2>
                                        <small>场地类资源总数,占总资源的:</small>
                                        <div class="stat-percent">
                                            1%
                                        </div>
                                        <div class="progress progress-mini" title="">
                                            <div style="width: 1%;" class="progress-bar"></div>
                                        </div>
                                    </li>
                                    
                                </ul>
                            </div>
                        </div>
                    </div>

                </div>
            </div>
        </div>
    </div>

    <!-- 全局js -->
    <script src="js/jquery.min.js?v=2.1.4"></script>
    <script src="js/bootstrap.min.js?v=3.3.6"></script>
    <!-- 自定义js -->
    <script src="js/content.js?v=1.0.0"></script>
    <!-- Flot -->
    <script src="js/plugins/flot/jquery.flot.js"></script>
    <script src="js/plugins/flot/jquery.flot.tooltip.min.js"></script>
    <script src="js/plugins/flot/jquery.flot.spline.js"></script>
    <script src="js/plugins/flot/jquery.flot.resize.js"></script>
    <script src="js/plugins/flot/jquery.flot.pie.js"></script>
    <script src="js/plugins/flot/jquery.flot.symbol.js"></script>
    <!-- Bootstrap-Treeview plugin javascript -->
    <script src="js/plugins/treeview/bootstrap-treeview.js"></script>
    <script src="js/demo/treeview-projectdemo.min.js"></script>
    <!-- Peity -->
    <script src="js/plugins/peity/jquery.peity.min.js"></script>
    <script src="js/demo/peity-demo.min.js"></script>


    <!-- jQuery UI -->
    <script src="js/plugins/jquery-ui/jquery-ui.min.js"></script>
    <!-- Jvectormap -->
    <script src="js/plugins/jvectormap/jquery-jvectormap-1.2.2.min.js"></script>
    <script src="js/plugins/jvectormap/jquery-jvectormap-world-mill-en.js"></script>
    <!-- EayPIE -->
    <script src="js/plugins/easypiechart/jquery.easypiechart.js"></script>
    <!-- Sparkline -->
    <script src="js/plugins/sparkline/jquery.sparkline.min.js"></script>
    <!-- Sparkline demo data  -->
    <script src="js/demo/sparkline-demo.min.js"></script>
    <!-- ECharts -->
    <script src="js/plugins/echarts/echarts-all.js"></script>
    <!-- ECharts demo data -->
    <script src="js/demo/echarts-demo-indexv6.min.js"></script>
    <!--<script>
        $("#modal-log").modal('toggle');
    </script>-->


    <script>

        $(document).ready(function () {
            //折叠ibox
            $('.collapse-link').click(function () {
                var ibox = $(this).closest('div.ibox');
                var button = $(this).find('i');
                var content = ibox.find('div.ibox-content');
                content.slideToggle(200);
                button.toggleClass('fa-chevron-up').toggleClass('fa-chevron-down');
                ibox.toggleClass('').toggleClass('border-bottom');
                setTimeout(function () {
                    ibox.resize();
                    ibox.find('[id^=map-]').resize();
                }, 50);
            });

            //关闭ibox
            $('.close-link').click(function () {
                var content = $(this).closest('div.ibox');
                content.remove();
            });
            $(".chart").easyPieChart({
                barColor: "#f8ac59",
                scaleLength: 5,
                lineWidth: 4,
                size: 80
            });
            $(".chart2").easyPieChart({
                barColor: "#1c84c6",
                scaleLength: 5,
                lineWidth: 4,
                size: 80
            });
            var h = [[c(2012, 1, 1), 7], [c(2012, 1, 2), 6], [c(2012, 1, 3), 4], [c(2012, 1, 4), 8], [c(2012, 1, 5), 9], [c(2012, 1, 6), 7], [c(2012, 1, 7), 5], [c(2012, 1, 8), 4], [c(2012, 1, 9), 7], [c(2012, 1, 10), 8], [c(2012, 1, 11), 9], [c(2012, 1, 12), 6], [c(2012, 1, 13), 4], [c(2012, 1, 14), 5], [c(2012, 1, 15), 11], [c(2012, 1, 16), 8], [c(2012, 1, 17), 8], [c(2012, 1, 18), 11], [c(2012, 1, 19), 11], [c(2012, 1, 20), 6], [c(2012, 1, 21), 6], [c(2012, 1, 22), 8], [c(2012, 1, 23), 11], [c(2012, 1, 24), 13], [c(2012, 1, 25), 7], [c(2012, 1, 26), 9], [c(2012, 1, 27), 9], [c(2012, 1, 28), 8], [c(2012, 1, 29), 5], [c(2012, 1, 30), 8], [c(2012, 1, 31), 25]];
            var g = [[c(2012, 1, 1), 800], [c(2012, 1, 2), 500], [c(2012, 1, 3), 600], [c(2012, 1, 4), 700], [c(2012, 1, 5), 500], [c(2012, 1, 6), 456], [c(2012, 1, 7), 800], [c(2012, 1, 8), 589], [c(2012, 1, 9), 467], [c(2012, 1, 10), 876], [c(2012, 1, 11), 689], [c(2012, 1, 12), 700], [c(2012, 1, 13), 500], [c(2012, 1, 14), 600], [c(2012, 1, 15), 700], [c(2012, 1, 16), 786], [c(2012, 1, 17), 345], [c(2012, 1, 18), 888], [c(2012, 1, 19), 888], [c(2012, 1, 20), 888], [c(2012, 1, 21), 987], [c(2012, 1, 22), 444], [c(2012, 1, 23), 999], [c(2012, 1, 24), 567], [c(2012, 1, 25), 786], [c(2012, 1, 26), 666], [c(2012, 1, 27), 888], [c(2012, 1, 28), 900], [c(2012, 1, 29), 178], [c(2012, 1, 30), 555], [c(2012, 1, 31), 993]];
            var e = [{
                label: "实际收缴率",
                data: g,
                color: "#1ab394",
                bars: {
                    show: true,
                    align: "center",
                    barWidth: 24 * 60 * 60 * 600,
                    lineWidth: 0
                }
            },
            {
                label: "收缴率指标线",
                data: h,
                yaxis: 2,
                color: "#464f88",
                lines: {
                    lineWidth: 1,
                    show: true,
                    fill: true,
                    fillColor: {
                        colors: [{
                            opacity: 0.2
                        },
                        {
                            opacity: 0.2
                        }]
                    }
                },
                splines: {
                    show: false,
                    tension: 0.6,
                    lineWidth: 1,
                    fill: 0.1
                },
            }];
            var a = {
                xaxis: {
                    mode: "time",
                    tickSize: [3, "day"],
                    tickLength: 0,
                    axisLabel: "Date",
                    axisLabelUseCanvas: true,
                    axisLabelFontSizePixels: 12,
                    axisLabelFontFamily: "Arial",
                    axisLabelPadding: 10,
                    color: "#838383"
                },
                yaxes: [{
                    position: "left",
                    max: 1070,
                    color: "#838383",
                    axisLabelUseCanvas: true,
                    axisLabelFontSizePixels: 12,
                    axisLabelFontFamily: "Arial",
                    axisLabelPadding: 3
                },
                {
                    position: "right",
                    clolor: "#838383",
                    axisLabelUseCanvas: true,
                    axisLabelFontSizePixels: 12,
                    axisLabelFontFamily: " Arial",
                    axisLabelPadding: 67
                }],
                legend: {
                    noColumns: 1,
                    labelBoxBorderColor: "#000000",
                    position: "nw"
                },
                grid: {
                    hoverable: false,
                    borderWidth: 0,
                    color: "#838383"
                }
            };
            function c(j, k, i) {
                return new Date(j, k - 1, i).getTime()
            }
            var b = null,
            d = null;
            $.plot($("#flot-dashboard-chart"), e, a);
            var f = {
                "US": 298,
                "SA": 200,
                "DE": 220,
                "FR": 540,
                "CN": 120,
                "AU": 760,
                "BR": 550,
                "IN": 200,
                "GB": 120,
            };
            $("#world-map").vectorMap({
                map: "world_mill_en",
                backgroundColor: "transparent",
                regionStyle: {
                    initial: {
                        fill: "#e4e4e4",
                        "fill-opacity": 0.9,
                        stroke: "none",
                        "stroke-width": 0,
                        "stroke-opacity": 0
                    }
                },
                series: {
                    regions: [{
                        values: f,
                        scale: ["#1ab394", "#22d6b1"],
                        normalizeFunction: "polynomial"
                    }]
                },
            })
        });
    </script>
</body>
</html>